<template>
  <pageTabelLayout>
    <template #pageHeader>
      <!-- 新增计划订单 -->
      <div class="my-header">
        <div style="height: 24px;width: 100%;border-bottom: 1px solid #e5e7eb; margin-bottom: 15px;"></div>
        <div class="search-form" v-if="headerShow">
          <a-form :model="fromList" size="mini">
            <a-row class="grid-demo" :style="{ height: '30px' }">
              <a-col :span="6">
                <a-form-item field="cards" label="订单号" label-col-flex="89px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.account" allow-clear>
                      <a-option v-for="item of basicData.hrEmployee" :value="item.id" :key="item.id"
                          :label="item.text" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="ddh" v-model="fromList.orderCode" :filter-option="false" @focus="ddh('')"
                            style="width:270px;marginBottom: 20px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option v-for="item in ddhList" :label="item.orderCode" :value="item.orderCode">{{
                        item.orderCode
                      }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="endTime" label="下单日期：" label-col-flex="89px">
                  <!-- <a-date-picker  popup-container="html"  v-model="fromList.endTime" style="width: 200px;" /> -->
                  <a-range-picker popup-container="html" class="bacClass" @change="onChange"
                                  @select="onSelect" style="width: 270px; marginBottom: 20px;"/>
                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="clientDyeCode" label="染整单号：" label-col-flex="89px">
                  <!-- <a-input v-model="fromList.ColorId" /> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch" v-model="fromList.clientDyeCode" :filter-option="false"
                            allow-search @focus="focusSel(1)" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option v-for="item in pageDataList" :label="item.clientDyeCode"
                              :value="item.clientDyeCode">{{ item.clientDyeCode }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="customName" label="客户名称：" label-col-flex="89px">
                  <!-- <a-input v-model="fromList.ColorName" /> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch" v-model="fromList.customName" :filter-option="false"
                            allow-search @focus="focusSel(2)" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option v-for="item in pageDataList" :label="item.customName"
                              :value="item.customName">{{ item.customName }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>
            </a-row>
            <a-row class="grid-demo" :style="{ height: '30px' }">
              <a-col :span="6">
                <a-form-item field="finishedClothCode" label="成品布号：" label-col-flex="98px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.customName" allow-clear>
                      <a-option v-for="item of basicData.custom" :value="item.id" :key="item.id"
                          :label="item.customName" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearchBh" v-model="fromList.clothCode" :filter-option="false"
                            allow-search @focus="focusSelBh" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option v-for="item in pageDataList" :label="item.clothCode"
                              :value="item.clothCode">{{ item.clothCode }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="delEndTime" label="交货日期：" label-col-flex="89px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.clientDyeCode" allow-clear>
                  </a-select> -->
                  <a-range-picker popup-container="html" class="bacClass" @change="onChange"
                                  @select="onSelect" style="width: 270px; marginBottom: 20px;"/>

                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="customOrderCode" label="客订单号：" label-col-flex="89px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.genDanCode" allow-clear>
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch" v-model="fromList.customOrderCode" :filter-option="false"
                            allow-search @focus="focusSel(3)" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }" @change="selectChange">
                    <a-option v-for="item in pageDataList" :label="item.customOrderCode"
                              :value="item.customOrderCode">{{ item.customOrderCode }}
                    </a-option>
                  </a-select>

                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="customOrderName" label="客订名称：" label-col-flex="89px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.dyType" allow-clear>
                      <a-option v-for="item of basicData.orderNature" :value="item.id" :key="item.id"
                          :label="item.detailName" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch" v-model="fromList.customOrderName" :filter-option="false"
                            allow-search @focus="focusSel(4)" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option v-for="item in pageDataList" :label="item.customOrderName"
                              :value="item.customOrderName">{{ item.customOrderName }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>
            </a-row>
            <a-row class="grid-demo" :style="{ height: '30px' }">
              <a-col :span="6">
                <a-form-item field="greyCode" label="坯布编号：" label-col-flex="98px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.account" allow-clear>
                      <a-option v-for="item of basicData.hrEmployee" :value="item.id" :key="item.id"
                          :label="item.text" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="pbSelect" v-model="fromList.greyCode" :filter-option="false" allow-search
                            @focus="pbSelect('')" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }">
                    <a-option v-for="item in pbList" :label="item.greyCode" :value="item.greyCode">{{
                        item.greyCode
                      }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="colorCode" label="色号：" label-col-flex="89px" style="height:52px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.clientDyeCode" allow-clear>

                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearchSh" v-model="fromList.colorCode" :filter-option="false"
                            allow-search @focus="focusSelSh(1)" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }" @change="selectChange">
                    <a-option v-for="item in pageDataList" :label="item.colorCode"
                              :value="item.colorCode">{{ item.colorCode }}
                    </a-option>
                  </a-select>

                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="colorName" label="色称：" label-col-flex="89px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.genDanCode" allow-clear>

                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch" v-model="fromList.colorName" :filter-option="false"
                            allow-search @focus="focusSelSh(2)" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }" @change="selectChange">
                    <a-option v-for="item in pageDataList" :label="item.colorName"
                              :value="item.colorName">{{ item.colorName }}
                    </a-option>
                  </a-select>

                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="orderNature" label="订单性质：" label-col-flex="89px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.dyType" allow-clear>
                      <a-option v-for="item of basicData.orderNature" :value="item.id" :key="item.id"
                          :label="item.detailName" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch" v-model="fromList.orderNature" :filter-option="false"
                            allow-search @focus="focusSel(5)" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }" @change="selectChange">
                    <a-option v-for="item in pageDataList" :label="item.orderNature"
                              :value="item.orderNature">{{ item.orderNature }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>
            </a-row>
            <a-row class="grid-demo" :style="{ height: '30px' }">
              <a-col :span="6">
                <a-form-item field="placeDepartment" label="下单部门：" label-col-flex="98px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.account" allow-clear>
                      <a-option v-for="item of basicData.hrEmployee" :value="item.id" :key="item.id"
                          :label="item.text" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch" v-model="fromList.placeDepartment" :filter-option="false"
                            allow-search style="width:270px;" :trigger-props="{ autoFitPopupMinWidth: true }"
                            @change="selectChange" @focus="focusSel(6)">
                    <a-option v-for="item in pageDataList" :label="item.placeDepartment"
                              :value="item.placeDepartment">{{ item.placeDepartment }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="openOrderState" label="开单状态：" label-col-flex="89px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.dyType" allow-clear>
                      <a-option v-for="item of basicData.orderNature" :value="item.id" :key="item.id"
                          :label="item.detailName" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :style="{ width: '320px' }"
                            v-model="fromList.openOrderState" style="width:270px">
                    <a-option value="ok">已开齐</a-option>
                    <a-option value="Y1">待开单：有坯布未开齐</a-option>
                    <a-option value="Y2">欠坯：没有坯布库存</a-option>
                  </a-select>
                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="craftState" label="完成状态：" label-col-flex="89px">
                  <a-select popup-container="html" class="bacClass" :style="{ width: '320px' }"
                            v-model="fromList.craftState" style="width:270px">
                    <a-option value="ok">所有工艺</a-option>
                    <a-option value="Y1">布号不存在</a-option>
                    <a-option value="Y2">工艺流程不存在</a-option>
                    <a-option value="Y3">坯布编号不存在</a-option>
                  </a-select>

                </a-form-item>
              </a-col>
              <a-col :span="6">
                <a-form-item field="cards" label="流转卡号:" label-col-flex="89px">
                  <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.account" allow-clear>
                      <a-option v-for="item of basicData.hrEmployee" :value="item.id" :key="item.id"
                          :label="item.text" />
                  </a-select> -->
                  <a-select popup-container="html" class="bacClass" :loading="loading" :allowClear="true"
                            @search="handleSearch" v-model="fromList.cards" :filter-option="false"
                            @focus="focusSelLz" style="width:270px;"
                            :trigger-props="{ autoFitPopupMinWidth: true }" multiple>
                    <a-option v-for="item in pageDataList" :label="item.flowCardCode"
                              :value="item.flowCardCode">{{ item.flowCardCode }}
                    </a-option>
                  </a-select>
                </a-form-item>
              </a-col>
            </a-row>
          </a-form>
        </div>

        <div class="my-divisders">
          <a-divider orientation="center">
            <icon-double-up v-if="headerShow" @click="headerShow = false" :strokeWidth="2" :size="18"/>
            <icon-double-down v-else @click="headerShow = true" :strokeWidth="2" :size="18"/>
          </a-divider>
        </div>


        <div class="my-tool-bar">
          <div class="bg-container-1">
            <div>
              <el-button type="primary" :icon="Search" class="stbutencx" @click="selectHandler">查询</el-button>
              <el-button type="success" :icon="CirclePlus" class="stbutenxz"
                         @click="addHandler">刷新订单
              </el-button>
              <el-button plain @click="billing">开单</el-button>
            </div>
          </div>
        </div>
      </div>
    </template>
    <template #pageTabel>
      <a-tabs   :lazy-load="true" default-active-key="0" @change="changeGet">
        <a-tab-pane key="0" title="开单管理">
          <AgGridVuesCopys style="height:calc(100% - 90px)" class="ag-theme-alpine" :columnDefs="tc"
                           :rowData="tableCon.tableConter" :defaultColDef="defaultColDef" :enableColResize="true"
                           rowSelection="multiple" @grid-ready="gridReady" :localeText="localeText1">
          </AgGridVuesCopys>
          <paginationCopys :total="paging.total" :page-size="paging.size" show-page-size show-total show-jumper
                           size="mini"
                           @change="pagingChange" @page-size-change="pagingSizeChange"
                           :current="pages"/>
        </a-tab-pane>
      </a-tabs>
    </template>
    <a-drawer :drawer-style="{ 'zIndex': 9999 }" title="创建生产流转卡" placement="bottom" :mask-closable="false"
              width="100"
              height="100%" :visible="pageData.importAdd" unmountOnClose @ok="sideaOk" @cancel="sideaNo"
              cancel-text='关闭'
              ok-text='创建流转卡'>
      <AgGridVuesCopys style="height:50%;width: 60%;float: left;" class="ag-theme-alpine" :columnDefs="tcZ1"
                       :rowData="tableCon.tableConter1" :defaultColDef="defaultColDef" :enableColResize="true"
                       rowSelection="multiple" :suppressRowTransform="true" @grid-ready="gridReady1"
                       :localeText="localeText1">
      </AgGridVuesCopys>
      <div style="float: left;height: 40%;width: 6%;text-align:center;font-size:16px;">
        <div
            style="height: 20%;background-color: #5B9BD5;color: #fff;margin:0px 3px 0px 3px;border:1px solid #0b0b0b;">
          <span>总匹数</span><br>
          <span style="font-size:20px;">{{ pageData.horseSum }}</span>
        </div>
        <div style="height: 20%;background-color: #5B9BD5;color: #fff;margin:3px 3px;border:1px solid #0b0b0b;">
          <span>已排匹数</span><br>
          <span style="font-size:20px;">{{ pageData.Scheduled }}</span>
        </div>
        <div style="height: 20%;background-color: #5B9BD5;color: #fff;margin:3px 3px;border:1px solid #0b0b0b;">
          <span>未排匹数</span><br>
          <span style="font-size:20px;">{{ pageData.Remainder }}</span>
        </div>
        <div style="height: 20%;background-color: #5B9BD5;color: #fff;margin:3px 3px;border:1px solid #0b0b0b;">
          <span>总重量</span><br>
          <span style="font-size:20px;">{{ pageData.weightSum }}</span>
        </div>
        <div style="height: 20%;background-color: #5B9BD5;color: #fff;margin:3px 3px;border:1px solid #0b0b0b;">
          <span>已排重量</span><br>
          <span style="font-size:20px;">{{ pageData.weighted }}</span>
        </div>
        <div style="height: 20%;background-color: #5B9BD5;color: #fff;margin:3px 3px;border:1px solid #0b0b0b;">
          <span>未排重量</span><br>
          <span style="font-size:20px;">{{ pageData.Unweight }}</span>
        </div>
      </div>
      <div style="float: left;height: 50%;width: 8%;">
        <el-button style="width: 100%;height: 100%;background-color: green;color: #fff;"
                   @click="OpenZip">生成
        </el-button>
      </div>
      <div style="width:100%;margin-top:10px;float:right;">
        <a-button type="primary" style="margin-right:10px;margin-left:53%"
                  @click="pageData.isEdit = true">修改
        </a-button>
        <a-button type="primary" @click="trialCalculation()">试算</a-button>
      </div>
      <div style="float: left;margin-top: 10px;width:100%">
        <table class="tableCla">
          <thead>
          <tr>
            <th colspan="7">分纱</th>
            <th colspan="8">库存</th>
          </tr>
          <tr>
            <th>缸数</th>
            <th>管数</th>
            <th>匹数</th>
            <th>重量</th>
            <!-- <th>设备</th> -->
            <th>织厂</th>
            <th>坯布编号</th>
            <th>纱批</th>
            <th>等级</th>
            <th>机台</th>
            <th>匹数</th>
            <th>退批备注</th>
            <th>来料单号</th>
            <th>库存匹数</th>
            <th>库存欠坯</th>
            <th>操作</th>
          </tr>
          </thead>
          <tbody>
          <tr v-for="(item, index) in pageData.cfList4" :key="index"
              :class="{ 'bacCla': item['vatNo'] == '合计' }">
            <td :rowspan="item['rowLen']" v-if="item['colShow']">{{
                item['vatNo'] == undefined ? "" : item['vatNo']
              }}
            </td>
            <td :rowspan="item['rowLen']" v-if="item['colShow']">{{
                item['castNum'] == undefined ? "" : item['castNum']
              }}
            </td>
            <td :rowspan="item['rowLen']" v-if="item['colShow']">{{
                item['yarnHouseNum'] == undefined ? "" : item['yarnHouseNum']
              }}
            </td>
            <td :rowspan="item['rowLen']" v-if="item['colShow']">{{
                item['yarnWeight'] == undefined ? "" : item['yarnWeight']
              }}
            </td>
            <td :rowspan="item['rowLen']" v-if="item['colShow']">{{
                item['firm'] == undefined ? "" :
                    item['firm']
              }}
            </td>
            <td :rowspan="item['rowLen']" v-if="item['colShow']">{{
                item['greyCode'] == undefined ? "" : item['greyCode']
              }}
            </td>
            <td :rowspan="item['rowLen']" v-if="item['colShow']">{{
                item['yarnBatch'] == undefined ? "" : item['yarnBatch']
              }}
            </td>
            <td>
              <a-select popup-container="html" class="bacClass" :loading="loading"
                        v-model="item.rankName" style="width:100px" v-if="item['rankName'] != undefined"
                        :filter-option="false" allow-search allow-clear @focus="focusSel4_1(item)"
                        @change="changeCf4_1(item)">
                <a-option v-for="item in pageData.nameList4_1" :value="item['grade']">{{
                    item['grade']
                  }}
                </a-option>
              </a-select>
            </td>
            <td>{{ item['greyMachineCode'] == undefined ? "" : item['greyMachineCode'] }}</td>
            <td>
              <a-input-number class="bacClass" v-model="item.greyHouseNum" @change="changeCf4_2(item)"
                              v-if="item['greyHouseNum'] != undefined" :min="0"/>
            </td>
            <td>{{ item['returnRemark'] == undefined ? "" : item['returnRemark'] }}</td>
            <td>{{ item['warrantCode'] == undefined ? "" : item['warrantCode'] }}</td>
            <td>{{ item['reyNum'] == undefined ? "" : item['reyNum'] }}</td>
            <td>{{ item['oweNum'] == undefined ? "" : item['oweNum'] }}</td>
            <td>
              <a-button type="primary" v-if="item['colShow'] && item['vatNo'] != '合计'"
                        @click="addRow(item, index)">新增
              </a-button>
              <a-button type="primary" status="danger" v-if="(!item['colShow']) && item['vatNo'] != '合计'"
                        @click="delRow(item)">删除
              </a-button>
            </td>
          </tr>

          </tbody>
        </table>
      </div>
    </a-drawer>
  </pageTabelLayout>
</template>

<script lang="ts">
import {post, get} from "@/api/http";
import {Search, CirclePlus, Delete, EditPen} from "@element-plus/icons-vue";
// import {
//     useTable,
//     useRowKey,
//     useTableColumn,
//     usePagination,
//     useRowSelection,
// } from "@/hooks/table";
// import { tcZ1, tcZ2 } from '../index'
import textClothRequires from '@/views/Aps/planOrderA/selectList/textClothRequires.vue'
import {useRouter} from 'vue-router';
import {ref, reactive, onMounted, onActivated, onUnmounted, watch} from "vue";
// import Toolbar from "@/components/Toolbar.vue";
import {Form, Message, Modal, Pagination} from "@arco-design/web-vue";
import {
  useTable,
  useRowKey,
  useTableColumn,
  usePagination,
  useRowSelection,
} from "@/hooks/table";
// import { FormInstance } from "@arco-design/web-vue/es/form";
// import emitter from "@/hooks/useEventBus";
// import validate from "@/hooks/useValidate";
//import { baseURL } from '../../../api/axios.config'
// import axios from "axios";
import {localeText} from '@/api/aggridZw'
import "ag-grid-community/styles/ag-grid.css";
import "ag-grid-community/styles/ag-theme-alpine.css";
import {} from "ag-grid-vue3";
import {number} from 'echarts/core';
import {max} from 'lodash';
import pageTabelLayout from "@/components/pageTabelLayout.vue";
//import aag from "./AGbut"
//import aag from "./agbuut.vue"
interface ClothSet {
  id?: any;
  serialNumber?: number | undefined,
  mercery?: string | undefined;
  deleteState?: any
  remark?: string | undefined;
  productionMode?: string | undefined;
  createName?: string | undefined;
  createTime?: string | undefined;
  updateName?: string | undefined;
  updateTime?: string | undefined;
}

interface pagings {
  size: number | string,
  total: number | string,
}

export default {
  name: "productionMode",
  setup() {
    const headerShow = ref<boolean>(true)
    const pages = ref(1);
    const pageData = reactive<{
      clothList: ClothSet[]
      showAdd: boolean
      sideTitle: string
      dropDownData: any
      pageLoading: boolean,
      theight: number,
      tablediv: any,
      rHeight: number | undefined,
      importAdd: boolean
      cfList4: any[]
      cfList3_1: any[]
      nameList4_1: any[]
      copyList: any[]
      isEdit: boolean
      horseSum: any
      Scheduled: any
      Remainder: any
      weightSum: any
      weighted: any
      Unweight: any
    }>({
      copyList: [],
      clothList: [],
      showAdd: false,
      sideTitle: "计划订单",
      dropDownData: "",
      pageLoading: false,
      theight: 0,
      tablediv: null,
      rHeight: 0,
      importAdd: false,
      cfList3_1: [],
      cfList4: [
        {
          "vatNo": "",
          "castNum": "",
          "yarnHouseNum": '',
          "yarnWeight": "",
          "cylinderType": '',
          "firm": "",
          "greyCode": '',
          "yarnBatch": "",
          "act4": "",
          sonInfo: [
            {
              "rankName": "",
              "greyMachineCode": "",
              "greyHouseNum": null,
              "returnRemark": "",
              "warrantCode": "",
              "reyNum": "",
              "oweNum": ""
            }
          ]
        }
      ],
      nameList4_1: [],
      isEdit: false,
      horseSum: 0,
      Scheduled: 0,
      Remainder: 0,
      weightSum: 0,
      weighted: 0,
      Unweight: 0,
    });
    const paging: pagings = reactive({
      size: 10,
      total: 30,
    })
    let shen = ref(0);
    const tableCon = reactive({
      tableConter: [],
      tableConter1: [],
      tableConter2: [
        {
          dyeworkerUserCode: 1,
          dyeworkerUserName: 2,
          dyeworkerCoefficient: 3,
          dyeworkerMoney: 4,
          show: true
        },
        {
          dyeworkerUserCode: 1,
          dyeworkerUserName: 2,
          dyeworkerCoefficient: 3,
          dyeworkerMoney: 4
        },
        {
          dyeworkerUserCode: 1,
          dyeworkerUserName: 2,
          dyeworkerCoefficient: 3,
          dyeworkerMoney: 4
        }
      ],
      tableConter3: [
        {
          "processName": '',
          "waterRatio": "",
          "act4": "",
          sonInfo: [
            {
              "adjuvantCode": "",
              "adjuvantName": "",
              "concentration": null,
              "unit": ""
            }
          ]
        }
      ]
    });
    const tableConA = reactive({
      tableConter: [],
    });
    //待处理/已处理 表头
    let columnDefs = [
      {
        rowHeight: 100,
        headerName: '',//选择列头部显示的文字，可以为空
        checkboxSelection: true,//设置为ture显示为复选框
        headerCheckboxSelection: true, //表头是否也显示复选框，全选反选用
        pinned: 'left', //固定再左边
        width: 50 //列的宽度
      },
      {headerName: "订单号", field: "orderCode",},
      {headerName: "下单日期", field: "authorizedStrengthTime",},
      {headerName: "下单部门", field: "placeDepartment"},
      {headerName: "染整单号", field: "clientDyeCode"},
      {headerName: "客户名称", field: "customName",},
      {headerName: "客订名称", field: "customOrderName"},
      {headerName: "布号", field: "clothCode"},
      {headerName: "品名", field: "'productName'",},
      {headerName: "色号", field: "colorCode"},
      {headerName: "确认色", field: "affirmColor"},
      {headerName: "色称", field: "colorName",},
      {headerName: "对色资料", field: "contrastColor"},
      {headerName: "匹数", field: "houseNum"},
      {headerName: "成品重量", field: "finishedWeight",},
      {headerName: "投染重量", field: "castDyeWeight"},
      {headerName: "总损耗", field: "allLoss"},
      {headerName: "订单性质", field: "orderNature",},
      {headerName: "布种类别", field: "greyType"},
      {headerName: "染色类型", field: "dyeingType"},
      {headerName: "缸型", field: "cylinderType",},


      {headerName: "生产车间", field: "workshop"},
      {headerName: "客户要求", field: "clothRequires",},


      {headerName: "总部工艺", field: "hqCraft",},
      // {
      //     headerName: '收费项',
      //     field: 'circulatCard',
      //     width: 600,
      //     children: [
      {headerName: "整理收费项目", field: "trimCharges",},
      {headerName: "合染类型", field: "joinDyeType"},
      {headerName: "一等品", field: "firstRate"},
      {headerName: "撞白", field: "bumpWhite",},
      {headerName: "湿擦提升", field: "wetRubbing"},
      {headerName: "耐氯提升", field: "chlorineResistant"},
      {headerName: "白色防沾处理", field: "stainResistance",},
      {headerName: "白色RC处理", field: "rcInfo"},
      {headerName: "抗黄处理", field: "resistanceYellow",},
      {headerName: "拔印", field: "dialPrinting"},
      {headerName: "重打包", field: "repeatPack"},
      {headerName: "需进缸", field: "needEnterPot",},
      {headerName: "高温定坯除白胶草", field: "hyperthermiaWhite"},
      {headerName: "收取染费", field: "takeDyeFee"},
      //     ]
      // },
      {headerName: "门幅", field: "efficacious"},
      {headerName: "克重", field: "gramWeight"},


      // {
      //     headerName: '总部',
      //     field: 'circulatCard',
      //     width: 600,
      //     children: [
      {headerName: "商品号", field: "tradeCode",},
      {headerName: "商品名称", field: "tradeName"},
      {headerName: "成品布号", field: "finishedClothCode"},
      {headerName: "成品名称", field: "finishedClothName",},
      {headerName: "商品门幅", field: "tradeEfficacious"},
      {headerName: "商品克重", field: "tradeGramWeight"},
      {headerName: "商品色号", field: "tradeColorCode",},
      {headerName: "商品色称", field: "tradeColorName"},
      //     ]
      // },


      // {
      //     headerName: '生产状态',
      //     field: 'circulatCard',
      //     width: 600,
      //     children: [
      {headerName: "存坯条数", field: "repertoryNum",},
      {headerName: "欠坯条数", field: "oweRepertoryNum"},
      {headerName: "已开单条数", field: "createOrderNum"},
      {headerName: "欠开单条数", field: "oweCreateOrderNum",},
      {headerName: "已染色条数", field: "deyNum"},
      {headerName: "欠染色条数", field: "oweDeyNum"},
      {headerName: "已批核条数", field: "auditNum",},
      {headerName: "欠批核条数", field: "oweAuditNum"},
      {headerName: "已出货条数", field: "outNum",},
      {headerName: "未出货条数", field: "oweOutNum"},
      {headerName: "HOLD单条数", field: "holdNum"},
      //     ]
      // },

      // {
      //     headerName: '重点工序',
      //     field: 'circulatCard',
      //     width: 600,
      //     children: [
      {headerName: "定坯", field: "orientStock",},
      {headerName: "烧毛", field: "singeing"},
      {headerName: "长车", field: "longVehicle"},
      {headerName: "拉针机", field: "needleDrawing",},
      {headerName: "预缩机", field: "preShrinking"},
      {headerName: "抓毛机", field: "combing"},
      {headerName: "梳剪联机", field: "thinningShearing",},
      {headerName: "摇粒机", field: "polarFleece"},
      //     ]
      // },
      {headerName: "客户布号", field: "customClothCode"},
      {headerName: "客户品名", field: "customProductName",},
      {headerName: "客户色号", field: "customColorCode"},
      {headerName: "客户色称", field: "customColorName"},
      {headerName: "客户PO号", field: "customPo"},
      {headerName: "客户订单号", field: "customOrderCode",},
      {headerName: "款号", field: "styleNumber"},
      {headerName: "最终买家", field: "ultimatelyBuyer"},
      {headerName: "季节", field: "season"},
      {headerName: "成分", field: "ingredient",},
      {headerName: "标签类型", field: "labelFormatCode"},
      {headerName: "测试标准", field: "testCriterion"},
      {headerName: "对色光源", field: "coloringIlluminant"},
      {headerName: "敏感色", field: "sensitiveColor",},
      {headerName: "颜色深浅", field: "colorDepth"},
      {headerName: "送货地址", field: "deliveryAddress"},
      {headerName: "纸筒", field: "paperTube"},
      {headerName: "加重", field: "aggravate",},
      {headerName: "定型剪办要求", field: "finalize"},
      {headerName: "质检剪办要求", field: "quality"},
      {headerName: "门幅上限", field: "upperLimit"},
      {headerName: "门幅下限", field: "lowerLimit"},
      {headerName: "克重上限", field: "gramUpperLimit"},
      {headerName: "克重下限", field: "gramLowerLimit",},
      {headerName: "坯布编号", field: "greyCode"},
      {headerName: "坯布名称", field: "greylame"},
      {headerName: "坯布深浅", field: "greyColorDepth"},
      {headerName: "珠地边", field: "edge"},


      // {
      //     headerName: '回修',
      //     field: 'circulatCard',
      //     width: 600,
      //     children: [
      {headerName: "缸号", field: "repairMachineCode",},
      {headerName: "布号", field: "repairClothCode"},
      {headerName: "布称", field: "repairProductName"},
      {headerName: "色号", field: "repairColorCode",},
      {headerName: "色称", field: "repairColorName"},
      //     ]
      // },
      // {
      //     headerName: '台巨 ',
      //     field: 'circulatCard',
      //     width: 600,
      //     children: [
      {headerName: "Prod Id", field: "prodId",},
      {headerName: "Seq No", field: "seqNo"},
      {headerName: "SHIPTO地址", field: "shiptoSite"},
      //     ]
      // },


      {headerName: "操作",},

    ];
    let ta: any[] = columnDefs.slice(0, 35)
    let tc: any[] = columnDefs.map((o) => {
      //let obj = {}
      if (o.headerName === '操作') {
        o['resizable'] = false
        o['filter'] = false
        o['sortable'] = false
        o["pinned"] = "right"
        o["width"] = 80
        o['cellRenderer'] = {
          template: `
            <el-button style="color:#165dff;" link @click="a">修改</el-button>`,
          setup(props: any) {
            const a = () => {
              editHandler(props.params.data)
            }
            return {
              a
            }
          }

        }
      }
      if (o.headerName == '客户要求') {
        o['resizable'] = true
        o['filter'] = false
        o['sortable'] = false
        o["pinned"] = "light"
        o["width"] = 300
        o['cellRenderer'] = textClothRequires
        o['cellRendererParams'] = {
          color: (params: any) => {

          }
        }
      }
      return o
    })
    const defaultColDef = {
      sortable: true,
      filter: true,
      //  flex: 1,
      resizable: true,
    };
    //查询表单
    const fromList = reactive({
      // page: 1,
      // size: 20,
      autStartTime: '',
      autEndTime: '',
      clientDyeCode: "",
      customName: '',
      colorCode: '',
      colorName: '',
      delStartTime: '',
      delEndTime: "",
      customOrderCode: "",
      customOrderName: '',
      greyCode: '',
      orderNature: '',
      placeDepartment: '',
      auditState: '',
      craftState: '',
      openOrderState: '',
      cards: '',


    })

    //下拉框
    const basicData = reactive({
      dictTypeList: ['订单性质', '结算方式', '面料销售类型', '结算公司'],
      ProductionMode: [],
      machinType: [],
      ExchangecalorieClassify: [],
      saleType: [],
      labelFormat: [],
      UrgentCategory: [],

      orderNature: [],
      Calculation: [],
      plusMaterial: [],
      corporation: [],
      custom: [],
      hrEmployee: [],
      baCompany: [],
      VerifyStandard: [],
      coloringMatch: [],
      seasonSet: [],


      dyeingList: [],              //染整单号下拉框
    })
    /************************************************************查询************************************************************************************/
        //查询
    const selectHandler = () => {
          pages.value = 1;
          doRefresh(shen.value);
        }

    function doRefresh(data: any) {
      pageData.pageLoading = true
      fromList.auditState = data
      post({
        url: "/aps/planOrder/getCreateOrderDetailInfo",
        data: {
          page: pages.value,
          size: paging.size,
          ...fromList
        }
      }).then(({data, code}: any) => {
        if (code === 200) {
          //  console.log(data, "结果");
          tableCon.tableConter = data.data;
          tableConA.tableConter = data.data;
          // gridOption.value.setRowData(data.data)
          paging.total = data.total;
          //     // pagination.setTotalSize(data.total);

        }
      })
          .catch(console.log).finally(() => {
        pageData.pageLoading = false
      })
    }

    /***************************************************删除***************************************************************************** */
    const trigger = ref('1');
    const gridOption = ref();
    const gridReady = (params: any) => {
      gridOption.value = params.api
    }
    const gridOption1 = ref();
    const gridReady1 = (params: any) => {
      gridOption1.value = params.api
    }
    const gridOption2 = ref();
    const gridReady2 = (params: any) => {
      gridOption2.value = params.api
    }
    const gridOption3 = ref();
    const gridReady3 = (params: any) => {
      gridOption3.value = params.api
    }
    const gridOptionA = ref()
    const gridReadyA = (params: any) => {
      gridOptionA.value = params.api
    }

    const billing = () => {
      if (gridOption.value.getSelectedRows().length === 0) {
        Message.error('请先勾选')
        return;
      }
      // 相同布号，色号，客户，生产车间相同
      const selectRows = gridOption.value.getSelectedRows().some((o: any) => {
        return (
            o.clothCode !== gridOption.value.getSelectedRows()[0].clothCode ||
            o.colorCode !== gridOption.value.getSelectedRows()[0].colorCode ||
            o.customName !== gridOption.value.getSelectedRows()[0].customName ||
            o.workshop !== gridOption.value.getSelectedRows()[0].workshop
        );
      });
      if (selectRows) {
        Message.error('请选择布号，色号，客户，生产车间相同的数据');
        return
      }
      //记录匹数总和
      pageData.isEdit = false
      pageData.weightSum = 0
      pageData.weighted = 0
      pageData.Unweight = 0
      pageData.horseSum = 0
      pageData.Scheduled = 0
      pageData.Remainder = 0
      gridOption.value.getSelectedRows().filter((o: any) => {
        pageData.horseSum += o.houseNum
        pageData.weightSum += o.castDyeWeight
      })
      tableCon.tableConter1 = []
      pageData.cfList4 = []
      pageData.cfList3_1 = []
      pageData.importAdd = true
      post({
        url: "aps/planOrder/getVatData",
        data: gridOption.value.getSelectedRows()
      }).then(({data, code, message}: any) => {
        if (code === 200) {
          data.data.forEach((item: any) => {
            if (item.clothCode) {
              // return { ...item, show: true };
              item.show = true
              return item
            } else {
              return item;
            }
          })
          tableCon.tableConter1 = data.data
          tableCon.tableConter1.filter((o: any) => {
            pageData.Scheduled += o.houseNum
            pageData.weighted += o.castDyeWeight
          })
          pageData.Remainder = pageData.horseSum - pageData.Scheduled
          pageData.Unweight = pageData.weightSum - pageData.weighted
          // console.log('这是数据获取来源', tableCon.tableConter1, data.data);

        } else {
          Message.error({
            content: message,
            duration: 5000,
          });
        }
      });
      // var arr = [];
      // if (trigger.value == '1') {
      //     if (shen.value == 0) {
      //         arr = gridOption.value.getSelectedRows().map((item) => {
      //             return item.id
      //         })
      //     } else {
      //         arr = gridOptionA.value.getSelectedRows().map((item) => {
      //             return item.id
      //         })
      //     }
      // } else {
      //     if (shen.value == 0) {
      //         arr = gridOption.value.getSelectedRows().map((item) => {
      //             return item.id
      //         })
      //     } else {
      //         arr = gridOptionA.value.getSelectedRows().map((item) => {
      //             return item.id
      //         })
      //     }
      // }

      //console.log(gridOption.value.getSelectedRows(), "lkj");
      // if (arr.length === 0) {
      //     Message.warning({
      //         content: "请选择要删除的数据",
      //         duration: 5000,
      //     });
      //     return;
      // }
      // console.log(arrs);
      // Modal.confirm({
      //     title: "系统提示",
      //     content: "确认删除选中的数据?",
      //     onOk() {
      //         post({
      //             url: "aps/planOrder/delete",
      //             data: arr,
      //         }).then(({ code, data, message }: any) => {
      //             // console.log(code,"删除的状态码")
      //             if (code === 200) {
      //                 Message.success({
      //                     content: "删除成功",
      //                     duration: 5000,
      //                 });
      //                 doRefresh(shen.value)
      //                 pages.value = 1;
      //             } else {
      //                 Message.error({
      //                     content: message,
      //                     duration: 5000,
      //                 });
      //             }
      //         });
      //     },
      // });
    };

    /*************************************************修改***********************************************************************************/
    const editHandler = (record: any) => {
      // initCum();
      //详情
      pageData.sideTitle = '修改资料'
      pageData.showAdd = true
    };

    /*************************************************新增************************************************************************************ */
    const router = useRouter()
    const addHandler = () => {
      router.push('/productmasterdata/order/planOrder/planOrderXin')
    }

    /************************************************待处理/已处理页签*******************************************************************************************/
    function changeGet(key: any) {
      trigger.value = key
      // console.log(key)
      if (key == 0) {
        shen.value = 0
        doRefresh(shen.value)
      } else {
        shen.value = 1
        doRefresh(shen.value)
      }
    };
    /************************************************分页***********************************************************************************************/
        //页改变
    const pagingChange = (current: number) => {
          // console.log(current, "分页改变");
          pages.value = current;
          // console.log(shen.value)
          doRefresh(shen.value);
        }
    //页条改变
    const pagingSizeChange = (pageSize: number) => {
      //  console.log(pageSize, "条数")
      pages.value = 1;
      paging.size = pageSize;
      doRefresh(shen.value);
    }

    /****************************************************选择日期********************************************************************************************** */
    function onSelect(dateString, date) {
      // console.log('onSelect', dateString, date);
    }

    function onChange(dateString, date) {
      // console.log('onChange: ', dateString, date);
      fromList.endTime = dateString
    }

    /******************************************************染整单号.客户名称.客户订单号.客订名称.订单性质下拉选查询************************************ */
        //下拉框得到焦点
    let pan = 0
    const focusSel = (value: any) => {
      let obj = {}
      switch (value) {
        case 1:
          obj = {clientDyeCode: ""}
          pan = 1
          break;
        case 2:
          obj = {customName: ''}
          pan = 2
          break;
        case 3:
          obj = {customOrderCode: ''}
          pan = 3
          break;
        case 4:
          obj = {customOrderName: ''}
          pan = 4
          break;
        case 5:
          obj = {orderNature: ''}
          pan = 5
          break;
        case 6:
          obj = {placeDepartment: ''}
          pan = 6
          break;
      }
      selCxAll(obj)
    }
    //下拉数据
    let pageDataList = ref([])
    let options = ref<any>(pageDataList.value);
    let loading = ref(false);
    const handleSearch = (value: any) => {
      let ob = {}
      switch (pan) {
        case 1:
          ob = {clientDyeCode: value}
          break;
        case 2:
          ob = {customName: value}
          break;
        case 3:
          ob = {customOrderCode: value}
          break;
        case 4:
          ob = {customOrderName: value}
          break;
        case 5:
          ob = {orderNature: value}
          break;
      }

      loading.value = true;
      selCxAll(ob);
      options.value = pageDataList.value;
      loading.value = false;
    };

    //下拉框查询
    function selCxAll(val: any) {
      post({
        url: "/aps/planOrder/getDropValue",
        data: val
      }).then(({data, code}: any) => {
        if (code === 200) {
          pageDataList.value = data;
        } else {
          Message.error({
            content: "查询失败！",
            duration: 5000,
          });
        }
      });

    };

    let selectChange = () => {
    };

    /******************************************************成品布号下拉选查询*************************************************************** */
    const focusSelBh = () => {
      setCxAllBh({clothCode: ''})
    };
    const handleSearchBh = (value: any) => {
      let ob = {clothCode: value}
      loading.value = true;
      setCxAllBh(ob)
      options.value = pageDataList.value;
      loading.value = false;
    };

    function setCxAllBh(val: any) {
      post({
        url: "/pdm/DevFabricInfo/getLikeList",
        data: val
      }).then(({data, code}: any) => {
        if (code === 200) {
          pageDataList.value = data;
        } else {
          Message.error({
            content: "查询失败！",
            duration: 5000,
          });
        }
      });
    }

    /******************************************************色号.色称.坯布编号下拉选查询************************************************************* */
    const focusSelSh = (val: any) => {
      let ob = {}
      switch (val) {
        case 1:
          ob = {colorCode: ''}
          break;
        case 2:
          ob = {colorName: ''}
          break;
        case 3:
          ob = {}
          break;
      }
      setCxAllSH(ob)

    };
    const handleSearchSh = (value: any) => {
      let ob = {greyCode: value}
      loading.value = true;
      setCxAllSH(ob)
      options.value = pageDataList.value;
      loading.value = false;
    };

    function setCxAllSH(val: any) {
      post({
        url: "/aps/planOrder/getDropValue1",
        data: val
      }).then(({data, code}: any) => {
        if (code === 200) {
          pageDataList.value = data;
        } else {
          Message.error({
            content: "查询失败！",
            duration: 5000,
          });
        }
      });
    }

    /******************************************************已下流转卡号************************************************************* */
    const focusSelLz = (val: any) => {
      setCxAllLz({flowCardCode: ''})
    };

    function setCxAllLz(val: any) {
      post({
        url: "/aps/circulatCard/getDropValue",
        data: val
      }).then(({data, code}: any) => {
        if (code === 200) {
          pageDataList.value = data;
        } else {
          Message.error({
            content: "查询失败！",
            duration: 5000,
          });
        }
      });
    }

    /**************************************************************************************************************************** */
    function sideaOk() {
      // pageData.cfList3_1 = outpage(pageData.cfList3_1, 'greyHouseNum')
      // pageData.cfList4.forEach((item:any)=>{
      // })
      let booleanOPEN = true
      pageData.cfList4.forEach((o: any) => {
        if (o.reyNum < o.yarnHouseNum) {
          return booleanOPEN = false
        }
      })
      pageData.cfList4.forEach((item: any) => {
        item.greyInfo = outpage(item.greyInfo, 'greyHouseNum')
        if ((item['id'] + "").indexOf('add') != -1) {
          item['id'] = null
        }
      })
      if (booleanOPEN) {
        post({
          url: "aps/circulatCard/insert",
          data: {
            vatInfo: tableCon.tableConter1,
            yarnInfo: pageData.cfList4
          }
        })
            .then((res: any) => {
              if (res.code === 200) {
                pageData.importAdd = false
                Message.success({
                  content: "新增成功",
                  duration: 5000,
                });
                doRefresh(shen.value);
              } else {
                Message.error({
                  content: res.message,
                  duration: 5000,
                });
              }
            });
      } else {
        Message.error({
          content: "库存匹数不能小于分纱匹数！",
          duration: 5000,
        });
      }

    }

    function sideaNo() {
      pageData.importAdd = false
    }

    class ShowCellRenderer {
      init(params: any) {
        const cellBlank = !params.value;
        if (cellBlank) {
          return;
        }

        this.ui = document.createElement('div');
        this.ui.innerHTML =
            '<div class="show-name">' +
            params.value.name +
            '' +
            '</div>' +
            '<div class="show-presenter">' +
            params.value.presenter +
            '</div>';
      }

      getGui() {
        return this.ui;
      }

      refresh() {
        return false;
      }
    }

    const tcZ1: any = [
      {
        headerName: '分缸',
        field: 'circulatCard',
        width: 1073,
        children: [
          {
            headerName: '缸型',
            field: 'cylinderType',
            width: 139,
            // cellclassRules: { 'show-cell': true },
            // cellRenderer: ShowCellRenderer,
            // rowSpan: (param: any) => {
            //     if (param.data.show) {
            //         return rowSpan(param)
            //     }
            //     return 1
            // },
          },
          {
            headerName: '管数',
            field: 'castNum',
            width: 139
          },

          {
            headerName: '开缸数',
            field: 'retainingNum',
            width: 139,
            cellRenderer: {
              template: `
                <a-input-number v-if="pageData.isEdit == true" v-model="val.retainingNum" @change="c" class="bacClass"
                                :min="0"/>
                <span v-else>{{ val.retainingNum }}</span>`,
              setup(props: any) {
                let val = ref(props.params.data)
                const c = () => {
                  maxRetainingNum(props.params.data)
                }
                return {
                  val,
                  c,
                  pageData,
                }
              }
            },
          },
          {

            headerName: '布号',
            field: 'clothCode',
            width: 139,
            // cellclassRules: { 'show-cell': true },
            // cellRenderer: ShowCellRenderer,
            // rowSpan: (param: any) => {
            //     if (param.data.show) {
            //         return rowSpan(param)
            //     }
            //     return 1
            // },
            // cellClassRules: { 'cell-span': 'value !== undefined' },
          },
          {
            headerName: '色称',
            field: 'colorName',
            width: 139,
            // cellclassRules: { 'show-cell': true },
            // cellRenderer: ShowCellRenderer,
            // rowSpan: (param: any) => {
            //     if (param.data.show) {
            //         return rowSpan(param)
            //     }
            //     return 1
            // },
          },
          {
            headerName: '色号',
            field: 'colorCode',
            width: 139,
            // cellclassRules: { 'show-cell': true },
            // cellRenderer: ShowCellRenderer,
            // rowSpan: (param: any) => {
            //     if (param.data.show) {
            //         return rowSpan(param)
            //     }
            //     return 1
            // },
          },
          {
            headerName: '匹数',
            field: 'houseNum',
            width: 139,
            // cellclassRules: { 'show-cell': true },
            // cellRenderer: ShowCellRenderer,
            // rowSpan: (param: any) => {
            //     if (param.data.show) {
            //         return rowSpan(param)
            //     }
            //     return 1
            // },
            cellRenderer: {
              template: `
                <a-input-number v-if="pageData.isEdit == true" class="bacClass" :min="0" v-model="val.houseNum"
                                @change="c"/>
                <span v-else>{{ val.houseNum }}</span>`,
              setup(props: any) {
                let val = ref(props.params.data)
                const c = () => {
                  maxhouseNum(props.params.data)
                }
                return {
                  val,
                  pageData,
                  c
                }
              }
            },
          },
          {
            headerName: '重量',
            field: 'castDyeWeight',
            width: 139,
            // cellclassRules: { 'show-cell': true },
            // cellRenderer: ShowCellRenderer,
            // rowSpan: (param: any) => {
            //     if (param.data.show) {
            //         return rowSpan(param)
            //     }
            //     return 1
            // },
            cellRenderer: {
              template: `
                <a-input-number v-if="pageData.isEdit == true" class="bacClass" :min="0" v-model="val.castDyeWeight"
                                @change="c"/>
                <span v-else>{{ val.castDyeWeight }}</span>`,
              setup(props: any) {
                let val = ref(props.params.data)
                const c = () => {
                  maxCastDyeWeight(props.params.data)
                }
                return {
                  val,
                  pageData,
                  c
                }
              }
            },
          },
        ]
      },


    ]
    const tcZ2 = useTableColumn([
      // {
      //     title: '分纱',
      //     children: [
      {
        title: '缸数',
        key: 'vatNo',
        dataIndex: "vatNo",
        // slotName: 'vatNo',
        width: 110
      },
      {
        title: '匹数',
        key: 'yarnHouseNum',
        // slotName: 'yarnHouseNum',
        dataIndex: "yarnHouseNum",
        width: 110
      },
      {
        title: '重量',
        key: 'yarnWeight',
        // slotName: 'yarnWeight',
        dataIndex: "yarnWeight",
        width: 110
      },
      // {
      //     title: '设备',
      //     key: 'cylinderType',
      //     // slotName: 'cylinderType',
      //     dataIndex: "cylinderType",
      //     width: 110
      // },
      {
        title: '织厂',
        key: 'firm',
        dataIndex: "firm",
        // slotName: 'firm',
        width: 110
      },
      {
        title: '坯布编号',
        key: 'greyCode',
        // slotName: 'greyCode',
        dataIndex: "greyCode",
        width: 110
      },
      {
        title: '纱批',
        key: 'yarnBatch',
        // slotName: 'yarnBatch',
        dataIndex: "yarnBatch",
        width: 110
      },
      // {
      //     title: '新增',
      //     key: 'ids',
      //     // pinned: 'right',
      //     width: 100,
      //     cellclassRules: { 'show-cell': true },
      //     // cellRenderer: ShowCellRenderer,
      //     rowSpan: param => {
      //         if (param.data.show) {
      //             return rowSpan1(param)
      //         }
      //         return 1
      //     },
      //     cellRenderer: {
      //         template: `
      //             <el-button style="color:#165dff;" @click="a" class="gesture" link>新增</el-button>`,
      //         setup(props: any) {
      //             const a = () => {
      //                 editHandler1(props.params.data)
      //             }
      //             return {
      //                 a
      //             }
      //         }
      //     }
      // }
      {
        title: "操作",
        key: "act4",
        dataIndex: "act4",
        slotName: "act4",
        width: 150, fixed: 'right'
      }
      //     ]
      // },
    ])
    const tcZ3 = useTableColumn([

      {
        title: '等级',
        key: 'rankName',
        dataIndex: "rankName",
        slotName: 'rankName',
        width: 110,

      },
      {
        title: '机台',
        key: 'greyMachineCode',
        dataIndex: "greyMachineCode",
        // slotName: 'greyMachineCode',
        width: 110
      },
      {
        title: '匹数',
        key: 'greyHouseNum',
        dataIndex: "greyHouseNum",
        slotName: 'greyHouseNum',
        width: 110,
      },
      {
        title: '退批备注',
        key: 'returnRemark',
        dataIndex: "returnRemark",
        // slotName: 'returnRemark',
        width: 110
      },
      {
        title: '来料单号',
        key: '来料单号',
        dataIndex: "warrantCode",
        // slotName: 'warrantCode',
        width: 110
      },
      {
        title: '库存匹数',
        key: 'reyNum',
        dataIndex: "reyNum",
        // slotName: 'reyNum',
        width: 110
      },
      {
        title: '库存欠坯',
        key: 'oweNum',
        dataIndex: "oweNum",
        // slotName: 'oweNum',
        width: 110
      },

      {
        title: "操作",
        key: "del4_1",
        dataIndex: "del4_1",
        slotName: 'del4_1',
        width: 150
      }


    ])
    const rowSpan = (param: any) => {
      const arr = ["cylinderType", "colorName", "colorCode", "houseNum", "castDyeWeight", "clothCode"];
      if (arr.indexOf(param.column.colId) !== -1) {
        // 需要校验的字段
        const data = arr.slice(0, arr.indexOf(param.column.colId) + 1);
        // 每一条第一次出现时对应的索引
        const first = tableCon.tableConter1.findIndex(item => {
          return data.every(v => item[v] === param.data[v]);
        });
        // console.log(data, '查验rowspan的问题', first);

        if (param.node.childIndex === first) {
          // 同一条出现的条数
          const rowspan = tableCon.tableConter1.filter(item => {
            return data.every(v => item[v] === param.data[v]);
          }).length;
          // console.log('这是合并方法', rowspan);
          return rowspan;
        } else {
          return 1;
        }
      }
    }

    const editHandler1 = (record: any) => {
      let newRows: any = {
        vatNo: '',
        yarnHouseNum: '',
        yarnWeight: '',
        cylinderType: '',
        firm: '',
        greyCode: '',
        yarnBatch: '',
        ids: '',
        rankName: '',
        greyMachineCode: '',
        greyHouseNum: '',
        returnRemark: '',
        warrantCode: '',
        dyeworkerUserName: '',
        oweNum: '',
        idd: '',
      };
      tableCon.tableConter2.push(newRows);
      setTimeout(function () {
        gridOption2.value.setRowData(tableCon.tableConter2)
      }, 0)
      // gridOption1.value.updateRowData({ add: newRows, addIndex: 1 });
    };
    // const editHandler2 = (record: any) => {
    //     tableCon.tableConter2.splice(props.params.rowIndex, 1)
    //     setTimeout(function () { gridOption2.value.setRowData(tableCon.tableConter2); }, 0)
    // };
    const OpenZip = () => {
      if (pageData.Remainder != 0) {
        Message.warning('未排匹数必须为0！')
        return
      }
      if (pageData.horseSum < pageData.Scheduled) {
        Message.warning('已超过计划单总匹数！')
        return
      }
      if (pageData.Unweight != 0) {
        Message.warning('未排重量必须为0！')
        return
      }
      if (pageData.weightSum < pageData.weighted) {
        Message.warning('已超过计划单总重量！')
        return
      }
      pageData.isEdit = false
      post({
        url: "aps/planOrder/getGreyData",
        data: tableCon.tableConter1
      }).then(({data, code, message}: any) => {
        if (code === 200) {
          pageData.copyList = []
          pageData.cfList4 = []
          pageData.copyList = data.data
          // console.log(pageData.copyList, '33332')
          let rowData = data.data
          let rowOb = {}
          rowData.forEach(function (o: any, index: any) {

            o['greyInfo'].forEach(function (o1: any, index1: any) {

              for (let key in o) {
                if (key != 'greyInfo') {
                  o1[key] = o[key]
                }
              }
              o1['rowLen'] = o['greyInfo'].length
              // 分组 planOrderDetailOneId下是一个合计 {planOrderDetailOneId：{info0:[{}]}}
              if (rowOb[o1['planOrderDetailOneId']] == undefined) {
                rowOb[o1['planOrderDetailOneId']] = {}
                if (rowOb[o1['planOrderDetailOneId']]['info' + index] == undefined) {
                  rowOb[o1['planOrderDetailOneId']]['info' + index] = []
                  rowOb[o1['planOrderDetailOneId']]['info' + index].push(o1)
                } else {
                  rowOb[o1['planOrderDetailOneId']]['info' + index].push(o1)
                }
              } else {
                if (rowOb[o1['planOrderDetailOneId']]['info' + index] == undefined) {
                  rowOb[o1['planOrderDetailOneId']]['info' + index] = []
                  rowOb[o1['planOrderDetailOneId']]['info' + index].push(o1)
                } else {
                  rowOb[o1['planOrderDetailOneId']]['info' + index].push(o1)
                }

              }

            })
          })

          //拆分分组 按顺序push  [{},{}]   rowLen 需要合计行数   colShow 是否需要显示列
          for (let key in rowOb) {
            let totalyarnHouseNum = 0
            let totalyarnWeight = 0
            for (let key1 in rowOb[key]) {
              rowOb[key][key1].forEach(function (o: any, index: any) {
                o['rowLen'] = rowOb[key][key1].length
                o['colShow'] = index == 0 ? true : false
                totalyarnHouseNum += o['yarnHouseNum']
                totalyarnWeight += o['yarnWeight']
                pageData.cfList4.push(o)
              })
            }
            // if (rowOb[key]["total"] = undefined) {
            let ob = {}
            ob['vatNo'] = '合计'
            ob['yarnHouseNum'] = totalyarnHouseNum
            ob['yarnWeight'] = totalyarnWeight
            ob['rowLen'] = 1
            ob['colShow'] = true
            pageData.cfList4.push(ob)
            // }

          }
          // console.log(pageData.cfList4);
        } else {
          Message.error({
            content: message,
            duration: 5000,
          });
        }
      });
    }

    const table = useTable();
    const rowKey = useRowKey("id");
    const indedata = ref(0)

    function xiangqing4(record1: any) {
      // console.log(record1, 'uuuuuuu');
      pageData.cfList3_1 = []
      pageData.cfList3_1 = record1.record.greyInfo

      if (pageData.cfList3_1.every((item: any) => item.greyHouseNum != null)) {
        pageData.cfList3_1.push({

          "rankName": "",
          "greyMachineCode": "",
          "greyHouseNum": null,
          "returnRemark": "",
          "warrantCode": "",
          "reyNum": "",
          "oweNum": "",
          "no": record1.record.no
        },)
      }
      pageData.cfList4.map((item: any) => {
        if (item.no == record1.no) {
          item.greyInfo = pageData.cfList3_1
        }
      })
    }

    const arr = ref({})

    function inputs(val: any) {
      val.status = true
      arr.value[val.itemId] = pageData.cfList3_1
    }


    // 子表  删除
    const delRow4_1 = (record: any) => {
      if (pageData.cfList3_1.length !== 1) {
        pageData.cfList3_1 = pageData.cfList3_1.filter(function (o: any) {
          return o['greyHouseNum'] !== record['greyHouseNum']
        })
      } else {
        Message.warning('最后一条数据，不可删除！')
      }

    }
    // 下拉数据
    const focusSel4_1 = (record: any) => {
      // console.log(record, '真服了这个破页面');
      let ob: any = {}
      pageData.cfList4.forEach((item: any) => {
        if (item.no == record.no) {
          ob = {...ob, greyCode: item.greyCode}
          tableCon.tableConter1.forEach((o: any) => {
            if (item.planOrderDetailOneId == o.detail1Id) {
              // ob = { ...ob, colorCode: o.colorCode }
              gridOption.value.getSelectedRows().forEach((i: any) => {
                if (item.planOrderDetailOneId == i.detail1Id) {
                  ob = {...ob, customOrderCode: i.customOrderCode}
                }
              })
            }
          })
        }
      })
      // console.log(ob, '嵌套循环的使用可能性');
      post({
        url: "wms/BlankStock/getGradeList",
        data: ob
      }).then(({data, code}: any) => {
        pageData.nameList4_1 = [{grade: '驳布'}, {grade: '白布'}, {grade: '布驳'}]
        if (code === 200) {
          // pageData.nameList4_1 = data;
          pageData.nameList4_1 = [{grade: '驳布'}, {grade: '白布'}, {grade: '布驳'}]
        } else {
          Message.error({
            content: "查询失败！",
            duration: 5000,
          });
        }
      });
    }

    const changeCf4_1 = (record: any) => {

      let ob: any = {}
      pageData.cfList4.forEach((item: any) => {
        if (item.no == record.no) {
          ob = {...ob, greyCode: item.greyCode, grade: record.rankName, houseNum: item.houseNum}
          tableCon.tableConter1.forEach((o: any) => {
            if (item.planOrderDetailOneId == o.detail1Id) {
              ob = {...ob, clothCode: o.clothCode}
              gridOption.value.getSelectedRows().forEach((i: any) => {
                if (item.planOrderDetailOneId == i.detail1Id) {
                  ob = {...ob, customOrderCode: i.customOrderCode, orderCode: i.orderCode}
                }
              })
            }
          })
        }
      })
      post({
        url: "aps/planOrder/getStockByGrade",
        data: ob
      }).then(({data, code}: any) => {
        if (code === 200) {
          // record.greyMachineCode = data.greyMachineCode
          // record.greyHouseNum = data.greyHouseNum
          record.returnRemark = data.returnRemark
          record.warrantCode = data.warrantCode
          record.reyNum = data.reyNum


        } else {
          Message.error({
            content: "查询失败！",
            duration: 5000,
          });
        }
      });
      let count1 = 0;
      let count2 = 0;
      for (let index = 0; index < pageData.cfList3_1.length; index++) {
        const element = pageData.cfList3_1[index];
        if (element['rankName'] == record['rankName']) {
          count1++
        }
        if (element['rankName'] == '') {
          count2++;
        }
        if (count1 > 1) {
          Message.warning('此等级已被选择过，请重新选择！')
          record['rankName'] = ""
          return
        }
      }
      //选择完成份给用户再新增一行
      if (count2 == 0) {
        pageData.cfList3_1.push({
          "rankName": "",
          "greyMachineCode": "",
          "greyHouseNum": null,
          "returnRemark": "",
          "warrantCode": "",
          "reyNum": "",
          "oweNum": "",
          "no": record.no
        })

      }
      // } else {
      //     pageData.cfList4[indedata.value].sonInfo[0].adjuvantCode = ''
      //     pageData.cfList4[indedata.value].sonInfo[0].concentration = ''
      //     Message.error({
      //         content: "请先填写左表工序数据！",
      //         duration: 5000,
      //     });
      // }


    }
    const changeCf4_2 = (record: any) => {
      // console.log(pageData.cfList4, '222')
      if (record.rankName.includes('驳')) {
        pageData.cfList4.forEach((item: any) => {
          if (record.row == item.no) {
            // console.log(record, item, '1')
            if (record.greyHouseNum > item.bNum) {
              return Modal.confirm({
                title: '系统提示',
                content: '驳布数量超出!',
                onCancel() {
                  //colShow == false 这个是新增数据，为true是系统数据
                  if (record.colShow) {
                    // console.log(pageData.copyList, '33333')
                    pageData.copyList.forEach((o: any) => {
                      if (o.no == item.no) {
                        record.greyHouseNum = o.greyInfo[0].greyHouseNum1
                      }
                    })
                  } else {
                    record.greyHouseNum = 0
                  }
                },
              })
            }
          }
        })
      }
      if (record.reyNum - record.greyHouseNum > 0) {
        record.oweNum = 0
      } else {
        record.oweNum = record.reyNum - record.greyHouseNum
      }
    }
    // 过滤必填数据为空的行数据事件
    const outpage = (item: any, fieldName: any) => {
      let data: any = [];
      if (item != undefined) {
        item.filter((o: any) => {
          if (o[fieldName] == '' || o[fieldName] == null || o[fieldName] == undefined) {
          } else {
            data.push(o);
          }
        })
        return data;
      }

    }

    function delRow(item: any) {
      pageData.cfList4 = pageData.cfList4.filter(function (o: any) {
        return o['id'] != item['id']
      })
      pageData.cfList4.forEach(function (o: any) {
        if (o['no'] == item['no']) {
          o['rowLen']--
        }
      })

    }

    let idAdd = 0

    function addRow(item: any, index: any) {
      idAdd++
      let ob = {
        "castNum": item['castNum'],
        "yarnHouseNum": item['yarnHouseNum'],
        "cylinderType": item['cylinderType'],
        "firm": item['firm'],
        "greyCode": item['greyCode'],
        "no": item['no'],
        "planOrderDetailOneId": item['planOrderDetailOneId'],
        "vatNo": item['vatNo'],
        "yarnBatch": item['yarnBatch'],
        // "yarnHouseNum": item['yarnHouseNum'],
        "yarnWeight": item['yarnWeight'],
        "greyHouseNum": 0,
        "greyMachineCode": "",
        "oweNum": 0,
        "rankName": "",
        "returnRemark": "",
        "reyNum": 0,
        "warrantCode": "",
        'rowLen': item['rowLen'] + 1,
        'colShow': false,
        "id": 'add' + idAdd
      }
      pageData.cfList4.forEach(function (o: any) {
        if (o['no'] == item['no']) {
          o['rowLen'] = o['rowLen'] + 1
        }
      })
      pageData.cfList4.splice(index + item['rowLen'] - 1, 0, ob);
      // console.log(pageData.cfList4);

    }

    const ddhList: any = ref([])

    const ddh = (val: any) => {
      post({
        url: "aps/planOrder/getDropValue",
        data: {
          orderCode: val
        }
      }).then(({data, code}: any) => {
        if (code === 200) {
          ddhList.value = data;
        } else {
          Message.error({
            content: "查询失败！",
            duration: 5000,
          });
        }
      });
    }

    const pbList: any = ref([])

    const pbSelect = (val: any) => {
      post({
        url: "product/pdGreyInformation/getFieldValue",
        data: {
          greyCode: val
        }
      }).then(({data, code}: any) => {
        if (code === 200) {
          pbList.value = data;
        } else {
          Message.error({
            content: "查询失败！",
            duration: 5000,
          });
        }
      });
    }
    const localeText1: any = ref(localeText)
    //试算
    const trialCalculation = () => {
      pageData.Scheduled = 0
      pageData.Remainder = 0
      pageData.weighted = 0
      pageData.Unweight = 0
      tableCon.tableConter1.filter((o: any) => {
        pageData.Scheduled += o.houseNum
        pageData.weighted += o.castDyeWeight
      })
      pageData.Remainder = pageData.horseSum - pageData.Scheduled
      pageData.Unweight = pageData.weightSum - pageData.weighted
    }
    //开缸数
    const maxRetainingNum = (data: any) => {
      //保留旧数据
      let oldhouse = 0
      let oldcastDyeWeight = 0
      oldhouse = data.houseNum
      oldcastDyeWeight = data.castDyeWeight

      //计算保存新数据
      let sum = data.normPower * data.castNum * data.retainingNum
      let sum1 = sum * 25
      data.houseNum = sum
      data.castDyeWeight = sum1
      tableCon.tableConter1 = [...tableCon.tableConter1]

      //条件限制
      if (sum > pageData.horseSum) {
        Message.warning('已超过计划单总匹数！')
        data.retainingNum = Math.ceil(oldhouse / data.normPower / data.castNum)
        data.houseNum = oldhouse
        data.castDyeWeight = oldcastDyeWeight
      } else {
        if (sum1 > pageData.weightSum) {
          Message.warning('已超过计划单总重量！')
          data.castDyeWeight = pageData.weightSum
        }
      }
    }
    //匹数
    const maxhouseNum = (data: any) => {
      //保留旧数据
      let oldweight = 0
      oldweight = data.castDyeWeight
      if (data.houseNum > pageData.horseSum) {
        Message.warning('已超过计划单总匹数！')
        data.houseNum = oldweight / 25
      }

      //修改数据
      // let sum = 0
      // sum = data.normPower * data.castNum * data.retainingNum
      data.retainingNum = Math.ceil(data.houseNum / data.normPower / data.castNum)
      data.castDyeWeight = data.houseNum * 25
      tableCon.tableConter1 = [...tableCon.tableConter1]
      // if (data.houseNum > sum) {
      //     Message.warning('已超过开缸数量可承载的匹数！')
      //     data.houseNum = sum
      // }
    }
    //重量
    const maxCastDyeWeight = (data: any) => {
      //保留旧数据
      let oldweight = 0
      oldweight = data.houseNum
      if (data.castDyeWeight > pageData.weightSum) {
        Message.warning('已超过计划单总重量！')
        data.castDyeWeight = oldweight * 25
      }

      //修改数据
      // let weight = 0
      // weight = data.houseNum * 25
      data.houseNum = Math.ceil(data.castDyeWeight / 25)
      data.retainingNum = Math.ceil(data.houseNum / data.normPower / data.castNum)
      tableCon.tableConter1 = [...tableCon.tableConter1]
      // if (data.castDyeWeight > weight) {
      //     Message.warning('已超过匹数所匹配的重量！')
      //     data.castDyeWeight = weight
      // }
    }
    return {
      maxCastDyeWeight,
      maxhouseNum,
      maxRetainingNum,
      trialCalculation,
      localeText1,
      pbSelect,
      pbList,
      ddhList,
      ddh,
      addRow,
      delRow,
      outpage,
      table,
      rowKey,
      indedata,
      changeCf4_1,
      changeCf4_2,
      delRow4_1,
      focusSel4_1,
      // handleSearch4_1,
      xiangqing4,
      inputs,


      OpenZip,
      // editHandler2,
      editHandler1,
      // onMounted,
      rowSpan,
      tcZ2,
      tcZ3,
      gridReady1,
      gridReady2,
      gridReady3,
      tcZ1,
      headerShow,
      selectHandler,
      pages,
      doRefresh,
      pageData,
      paging,
      shen,
      tableCon,
      tableConA,
      billing,
      trigger,
      gridOption,
      gridReady,
      gridOptionA,
      gridReadyA,
      addHandler,
      changeGet,
      tc,
      ta,
      defaultColDef,
      editHandler,
      columnDefs,
      pagingChange,
      pagingSizeChange,
      fromList,
      basicData,
      Delete,
      Search,
      CirclePlus,
      EditPen,
      onSelect,
      onChange,
      focusSel,
      pageDataList,
      options,
      loading,
      handleSearch,
      selectChange,
      pan,
      focusSelBh,
      handleSearchBh,
      setCxAllBh,
      focusSelSh,
      handleSearchSh,
      setCxAllSH,
      focusSelLz,
      setCxAllLz,
      router,
      sideaOk,
      sideaNo
    };
  },
  components: {
    pageTabelLayout,
    textClothRequires
  }
};
</script>
<style lang="less" scoped>
.pagings {
  margin-top: 10px;
  display: flex;
  justify-content: center;
}

.arco-input-wrapper {
  background-color: #fff !important;
  border: 1px solid #cccccc;
}

.arco-form-item-status-error .arco-input-wrapper:not(.arco-input-disabled),
.arco-form-item-status-error .arco-textarea-wrapper:not(.arco-textarea-disabled) {
  border: 1px solid #f53f3f;
}


/********************************************** */
.stbutencx {
  background-color: #409eff;

  &:hover {
    background-color: #79bbff;
  }
}


.ag-header-cell-resize::after {
  top: 0 !important;
  height: 100% !important;
}

// .ag-cell {
//     border-right: 1px solid #D9DDDF !important;
// }
:deep(.ag-cell) {
  border-right: 1px solid #dde2eb;
}

:deep(.ag-header-cell) {
  border-right: 1px solid #dde2eb;
}

.stbutenxz {
  background-color: #67c23a;

  &:hover {
    background-color: #b3e19d;
  }
}

.arco-row {
  margin-bottom: 0px;
}

.ag-header-group-cell-label,
.ag-header-cell-label {
  justify-content: center !important
}

.ag-header-cell,
.ag-header-group-cell {
  border-right: 1px solid #dde2eb !important;
}

:deep(.span-item) {
  background: #fff;
  display: flex;
  align-items: center;
  top: 1px;
  border-bottom: 1px solid #ebeef5 !important;
}

[col-id='clothCode'],
[col-id='cylinderType'],
[col-id='colorName'],
[col-id='colorCode'],
[col-id='houseNum'],
[col-id='castDyeWeight'] {
  background: #fff;

  border-left: 1px solid lightgrey !important;
  border-right: 1px solid lightgrey !important;
  border-bottom: 1px solid lightgrey !important;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.tableCla {
  display: block;
  border-collapse: collapse;
  width: 100%;
}

.tableCla th,
.tableCla td {
  border: 1px solid #cccccc;
  padding: 5px 10px;
}

.bacCla {
  background-color: #e5f1ff;
}

:deep(.arco-tabs) {
  height: 100%;
}

:deep(.arco-tabs-content) {
  height: 100%;
}

:deep(.arco-tabs-content-list) {
  height: 100%;
}

:deep(.arco-tabs-pane) {
  height: 100%;
}

/************************************************** */
</style>
<script setup lang="ts">
</script>